<template>
	<view class="nt-card-item" @tap="$emit('click', $event)">
		<view class="nt-card-item__label">
			<image class="nt-card-item__label--before" :src="beforeIcon" v-if="beforeIcon"></image>
			{{ label }}
			<!-- <slot name="after"></slot> -->
		</view>
		<view class="nt-card-item__desc">
			{{ desc }}
			<slot name="desc"></slot>
			<text class="iconfont" v-if="isLink">&#xe622;</text>
		</view>
		<slot></slot>
	</view>
</template>

<script>
export default {
	props: {
		label: {
			type: String,
			default: ""
		},		
		desc: {
			type: String,
			default: ""
		},
		beforeIcon: {
			type: String,
			default: ""
		},
		isLink: {
			type: Boolean,
			default: false
		}
	}
}
</script>

<style lang="scss" scoped>
.nt-card-item{
	display:flex;
	align-items: center;
	justify-content: space-between;
	height: 90rpx;
	
	&__label{
		display:flex;
		align-items: center;
		position: relative;
		font-size: 30rpx;
		color: #333;
		font-weight: bold;
		&--before{
			width: 50rpx;
			height: 50rpx;
			position: absolute;
			left: -60rpx;
		}
	}
	&__desc{
		font-size: 24rpx;
		color: #333;
		margin-top: 10rpx;
		// flex: 1;
	}
}
</style>